body{background:#ccf;font-family:sans-serif;font-size:16px;color:#333;}
tape{display:block;border:1px solid #ddd;color:#000;background:#fff;border:none;border-bottom:2px solid #6b6;margin-bottom:8px;}
tape>div{padding:16px;}
a{color:#00f;text-decoration:none;;}a:hover{color:#f00;}
div#for-ie>div.box{background:#f99;color:#000;}
hr{border:none;border-bottom:1px solid #999;}

div#header{display:block;background:#fff;margin-bottom:8px;border:none;border-bottom:2px solid #6b6}
div#header a{color:#333;padding:16px;display:inline-block;border-right:1px solid #ddd;}
div#header a:hover{background:#eee;}
div#main{background:#fff;}

text.info{font-size:12px;}
text.hash{font-family:monospace;}

input,textarea{border-radius:0;border:1px solid #ddd;padding:4px;}
textarea{min-height:80px;resize:vertical;}

input[type=submit]{
	background:linear-gradient(
		#3b6 20%,
		#3d6 50%,
		#3a5 50%,
		#3b6 100%
	);
	color:#fff;
	padding: 8px;
	border-radius:3px;
	border:1px solid #0b0;
	font-size:16px;
}
input[type=submit]:hover{
	filter:brightness(1.1);
}

@media screen and (max-device-width: 10cm){
	div#header,div#main,tape{width:100%;}
	div#main form,div#main div.box{padding:8px;}
	form input,textarea{width:100%;}
}
@media screen and (min-device-width: 10cm){
	body{margin:22px;}
	div#header,div#main,tape{width:70%;}
	div#main form,div.box{padding:16px;}
	form input:not([type=submit]),textarea{width:40%}
	form input[type=submit]{width:60px;}
}
